<template>
	<view>
		<nav-bars bgColor="#fff" fontColor="#000" title="全部评价"></nav-bars>
		<view style="border-top: 1px solid #F8F8F8;">
			<view style="padding: 32rpx;">
				<view v-for="(item,index) in PackComment" :key="index" style="display: flex;align-items: flex-start;border-bottom: 1px solid #F4F4F4;padding-bottom: 32rpx;margin-bottom: 32rpx;" >
					<view style="width: 84rpx;height: 84rpx;margin-right: 20rpx;overflow: hidden;border-radius: 100%;"><image :src="item.user_id.avatar.path" mode=""></image></view>
					<view style="flex: 1;">
						<view style="flex: 1;margin-bottom: 15rpx;">
							<view style="display: flex;align-items: center;justify-content: space-between;margin-bottom: 10rpx;">
								<view style="font-size: 28rpx;font-weight: 600;color: #333333;">{{item.user_id.username}}</view>
								<view style="font-size: 24rpx;font-weight: 400;color: #939393;">{{item.create_time | formatDate}}</view>
							</view>
							<u-rate :count="5" disabled :value="item.score" active-color="#FFD425" inactive-color="#E6E6E6" inactive-icon="star-fill"></u-rate>
						</view>
						<!-- <view style="font-size: 24rpx;font-weight: 400;color: #939393;margin-bottom: 15rpx;">复古[平板多用途+瓷白]</view> -->
						<view style="font-size: 28rpx;font-weight: 400;color: #333333;">{{item.content}}</view>
						<view style="display: flex;align-items: center;margin-top: 20rpx;">
							<view v-if="item.type == 1" v-for="(items,indexs) in item.file" :key="indexs" style="width: 180rpx;height: 180rpx;margin-right: 10rpx;border-radius: 4rpx;overflow: hidden;">
								<image @tap.stop="preview(item.file,indexs)" :src="items.path"></image>
							</view>
							<view v-if="item.type == 2" v-for="(items,indexs) in item.file" :key="indexs" style="width: 180rpx;height: 180rpx;margin-right: 10rpx;border-radius: 4rpx;overflow: hidden;">
								<video style="width: 180rpx;height: 180rpx;" id="myVideo" :src="items.path" controls></video>
							</view>
						</view>
						<!-- <view style="margin-top: 20rpx;background: #F8F8F8;padding: 20rpx;">
							<view style="font-size: 28rpx;font-weight: 400;color: #888;">
								<text style="font-weight: 500;color: #666;margin-right: 20rpx;">店家回复: </text>
								<text>设计效果很不错，软装选购也给了很多的建议，很多问题都帮助解决了，好评~</text>
							</view>
						</view> -->
					</view>
				</view>
				<view v-if="PackComment.length == 0" style="position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);">
					<u-empty text="暂无数据" mode="list" icon-size="550" src="https://cos.ryz1620.com/liankun/static/nullBg.png"></u-empty>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import GoodsEvaluate from '@/service/GoodsEvaluate.js';
export default {
	data() {
		return {
			pack_id: '',
			PackComment: []
		};
	},
	onLoad(params) {
		this.$utils.getUrl()
		console.log(params);
		this.pack_id = params.pack_id;
		this.getPackCommentList();
	},
	filters: {
		formatDate(value) {
			let date = new Date(parseInt(value) * 1000);
			let y = date.getFullYear();
			let m = date.getMonth() + 1;
			m = m < 10 ? '0' + m : m;
			let d = date.getDate();
			d = d < 10 ? '0' + d : d;
			let h = date.getHours();
			h = h < 10 ? '0' + h : h;
			let minute = date.getMinutes();
			let second = date.getSeconds();
			minute = minute < 10 ? '0' + minute : minute;
			second = second < 10 ? '0' + second : second;
			return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;
		}
	},
	methods: {
		getPackCommentList() {
			var that = this;
			var params = {
				pack_id: that.pack_id
			};
			GoodsEvaluate.getPackCommentList(params).then(res => {
				if (res.code == 1) {
					var data = res.data;
					that.PackComment = data
					console.log(data);
				} else {
					uni.showToast({
						title: res.msg,
						icon: 'none'
					});
				}
			});
		},
		// 预览图片
		preview(urls,index) {
			let img_url = []
			for (let i = 0; i < urls.length; i++) {
				img_url.push(
					urls[i].path
				);
			}
			uni.previewImage({
				urls: img_url,
				current: index,
				longPressActions: {
					itemList: ['发送给朋友', '保存图片', '收藏'],
					success: function(data) {
						console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
					},
					fail: function(err) {
						console.log(err.errMsg);
					}
				}
			});
		},
	}
};
</script>

<style>
page {
	background: #fff;
}
</style>
